<!--导航栏-->
<div class="row-fluid">
    <div class="navbar no-margin">
        <div class="navbar-inner">
            <ul class="breadcrumb">
                <i class="icon-chevron-left hide-sidebar"><a href='#' title="Hide Sidebar" rel='tooltip'>&nbsp;</a></i>
                <i class="icon-chevron-right show-sidebar" style="display:none;"><a href='#' title="Show Sidebar"
                        rel='tooltip'>&nbsp;</a></i>
                <li>
                    <a href="#/sre">首页</a>
                </li>
                <li class="active">宽表字段监控趋势</li>
            </ul>
        </div>
    </div>
</div>

<style type="text/css">
    .form-control {
        height: 25px;
        padding: 0 3px;
        font-size: 12px;
        min-width: 150px;
    }

    .btn {
        padding: 3px 16px;
        font-size: 12px;
    }
</style>
<div style="padding: 0 10px 0; float:left;">
    <div style="text-align: left;font-size: 1.2rem; color: red;">
        数据负责人：wanglizhou，产出时间：10:15， doris表：app_zp_rock_bcp_flow_field_monitor_v2 <br/>
        日变化率 t2_inc_rate= (t1-t2)/t2, 周变化率 t8_inc_rate = (t1-t8)/t8, 占比：d1_rate= t1/total, d7_rate=avg_7d/avg_7d_total， metric_val指标值， metric_val_7d_avg7日均值
    </div>
    <br />
</div>


<div style="margin: 10px;">
    <form class="form-inline" style="text-align: center;padding-bottom: 11px;">
        <div class="form-group">

            <div class="form-group">
                <label for="metric">指标：</label>
                <select class="form-control" ng-model="vm.p.metric" id="metric">
                    <option value="total_ct">total_ct</option>
                    <option>sid</option>
                    <option>platform</option>
                    <option>logsource</option>
                    <option>info_id</option>
                    <option>tjfrom</option>
                    <option>disp_local1</option>
                    <option>source1</option>
                    <option>search_pos</option>
                    <option>requesttype</option>
                    <option>disp_cate2</option>
                    <option>slot</option>
                </select>
            </div>
            <div class="form-group">
                <label for="biz">数据域：</label>
                <select class="form-control" ng-model="vm.p.biz" id="biz">
                    <option value="wb">wb</option>
                    <option>gj</option>
                    <option>tcb</option>
                    <option>tz</option>
                </select>
            </div>

            <div class="form-group">
                <label for="biz">行为类型：</label>
                <select class="form-control" ng-model="vm.p.actionType" id="actionType">
                    <option value="exposure">exposure</option>
                    <option>search</option>
                    <option>infodetail</option>
                    <option>im_connect</option>
                    <option>tel_conn</option>
                    <option>resume_delivery</option>
                    <option>jz_deduction</option>
                    <option>yx_deduction</option>
                </select>
            </div>

            <div class="form-group">
                <label for="biz">日志来源：</label>
                <select class="form-control" ng-model="vm.p.logsource" id="logsource">
                    <option value="0">ALL</option>
                    <option value="-">-</option>
                    <option>default</option>

                    <option>search_zhuzhan</option>
                    <option>search_mainpage</option>
                    <option>search_personcenter</option>
                    <option>search_supplement</option>
                    <option>search_rec</option>
                    <option>search_tcb</option>

                    <option>exposure_mainpage</option>
                    <option>exposure_middle_page</option>
                    <option>exposure_personcenter</option>
                    <option>exposure_tcb</option>
                </select>
            </div>
        </div>
        <button id="refreshTable" type="button" class="btn btn-primary" ng-click="loadChart()">
            <span class="glyphicon glyphicon-search" aria-hidden="true"></span> 查询</button>
    </form>
</div>
<div class="container-fluid">
    <div style="margin: 10px; height: 1050px">
        <table id="list_table" class="table table-condensed">
            <thead>
            <tr>
                <th data-field="SerialNumber" data-formatter="serialFormatter">序号</th>
                <th data-field="biz" >数据域</th>
                <th data-field="actionType" >行为类型</th>
                <th data-field="metricKey" >指标</th>
                <th data-field="logsource" >日志来源</th>
                <th data-field="logsource" data-formatter="queryOptFmt">操作</th>
            </tr>
            </thead>
        </table>
        <div class="row" style="height: 350px">
            <div class="col-sm-12 col-md-12 main" style="height:100%">
                <h3 class="sub-header" style="text-align:center;font-size: 16px;"> 数据量趋势图 </h3>
                <div id="total_trend" style="height: 80%;width:100%"></div>
            </div>
        </div>
        <div class="row" style="height: 350px">
            <div class="col-sm-12 col-md-12 main" style="height:100%">
                <h3 class="sub-header" style="text-align:center;font-size: 16px;"> 数据增量变化率 </h3>
                <div id="inc_trend" style="height: 80%;width:100%"></div>
            </div>
        </div>
        <div class="row" style="height: 350px">
            <div class="col-sm-12 col-md-12 main" style="height:100%">
                <h3 class="sub-header" style="text-align:center;font-size: 16px;"> 数据占比趋势图 </h3>
                <div id="ratio_trend" style="height: 80%;width:100%"></div>
            </div>
        </div>
    </div>
</div>